<%@ page language="java" contentType="text/html; charset=UTF-8"%>
<%
	String path = request.getContextPath() + "/";
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path;
%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<head>
<base href="<%=basePath%>">
<meta charset="UTF-8">
<title>朗读亭-朗读欣赏</title>
<link rel="stylesheet" href="css/style2/d_common.css">
<link rel="stylesheet" href="css/style2/common1.css">
<style type="text/css">
.color1 {
	background: #0c7aae;
}

.color2 {
	background: #1585bc;
}

.color3 {
	background: #0d8dca;
}

.color4 {
	background: #1fa4e5;
}

#rankingList {
	margin: 0 auto;
	width: 780px;
	padding: 10px;
	position: relative;
	text-align: center;
	background: #25b3df;
}

.abtn {
	display: block;
	width: 110px;
	height: 55px;
	text-align: center;
	line-height: 55px;
}

.pagebtn {
	border-radius: 5px;
	background: #00be59;
	color: #fff;
	font-size: 18px;
	padding-left: 5px;
	margin: 20px auto;
}

.pagebtn img {
	float: left;
	width: 20px;
	margin: 23px 5px 0 15px;
}

#backbtn img {
	width: 13px;
	margin: 18px 5px 0 15px;
}

#backbtn {
	width: 130px;
	background: #ba3433;
}

#ewmdiv {
	float: left;
	width: 29%;
	height: 270px;
	background: #fff;
	margin: 5px 0;
}

#ewmdiv img {
	width: 80%;
	padding: 15px 10%;
}

#ewmdiv a {
	width: 100%;
	color: #20a8da;
	font-size: 18px;
	height: 30px;
	line-height: 30px;
}

#marqueediv {
	margin: 5px 0;
	width: 70%;
	float: right;
	height: 270px;
	background: #2783dd;
}

#marqueediv marquee {
	width: 96%;
	height: 250px;
	margin: 10px 2%;
}
</style>


</head>
<body>
	<div class="header">
		<div class="logo">

			<a href="declaimer/first?guid=${guid}&devicecode=${devicecode}"><img
				src="img/n_logo.png" alt="">&nbsp; </a>
		</div>
		<div class="user">
			<c:if test="${user!=null }">
			<img
				src="${user.pic==null?'img/man.png':user.pic==''?'img/man.png':user.pic }"
				alt="">
			<div class="admin">
				<span class="name">${user.name }</span><span class="number">【${user.cardno
					}】</span>
			</div>
			</c:if>
		</div>
	</div>
	<!--end header-->
	<!--朗读排行榜-->
	<div id="rankingList">
		<div id="video">
			<video src="${r.url }" id="videosrc" style="width: 100%; height: 360px;"
				controls="controls"> 您的浏览器不支持 video 标签。 </video>
		</div>
		<div id="ewmdiv">
			<img class="erweima" src="css/style2/img/wx.png" /> <a>关注信昇达朗读吧</a>
		</div>
		<div id="marqueediv">
			<marquee id="marquee" direction="up" scrolldelay="100"
				behavior="scroll" contenteditable="true" scrollamount="2"
				width="100%" height='400px' onmouseover="this.stop();"
				onmouseout="this.start();">
				${r.content }
			</marquee>
		</div>
		<div style="clear: both;"></div>

	</div>
	<a id="backbtn" href="declaimer/bd?guid=${guid}&devicecode=${devicecode}" class="pagebtn abtn"><img
		src="css/style2/img/rlist_back.png">返回排行榜</a>
	<div class="footer">
		<div class="copyright" style="text-align: center;">${c.footer }
		</div>
	</div>
</body>
</html>
